<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>CSS Test: Empty Fixed-size Block Rotation 90deg</title>
  <link rel="help" href="RELEVANT_SPEC_SECTION"/>
  <link rel="author" title="Apple" href="http://www.apple.com/"/>
  <link rel="match" href="reftest/rotate-90deg-001-ref.xht"/>
  <meta name="flags" content="" />
  <meta name="assert" content="CSS rotation transform of 90deg rotates an element 90 degrees clockwise."/>
  <style type="text/css"><![CDATA[
	#box {
		width: 100px;
		height: 50px;
		background-color: fuchsia;
		border-top: orange solid 50px;
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		transform: rotate(90deg);
	}
  ]]></style>
 </head>
 <body>

	<p>You should see a vertical fuchsia stripe next to an orange stripe.</p>
	<div id="box">
	</div>

 </body>
</html>
